﻿@using MY.ShoppingBackstage.Model;
@{
    var user = ViewBag.address as List<UAddress>;
    var GetAddress = ViewBag.GetAddress as List<UAddress>;
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link href="~/css/shop.css" type="text/css" rel="stylesheet" />
    <link href="~/css/Sellerber.css" type="text/css" rel="stylesheet" />
    <link href="~/css/bkg_ui.css" type="text/css" rel="stylesheet" />
    <link href="~/font/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <script src="~/js/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="~/js/jquery.cookie.js"></script>
    <script src="~/js/shopFrame.js" type="text/javascript"></script>
    <script src="~/js/Sellerber.js" type="text/javascript"></script>
    <script src="~/js/layer/layer.js" type="text/javascript"></script>
    <script src="~/js/laydate/laydate.js" type="text/javascript"></script>
    <script type="text/javascript" src="~/js/proTree.js"></script>
    <script src="~/layui/layui.js" type="text/javascript"></script>
    <link rel="stylesheet" href="~/layui/css/layui.mobile.css" />
    <link rel="stylesheet" href="~/layui/css/layui.css" />
    <title>会员管理</title>
</head>
<body>
    <div class="margin" id="page_style">
        <div class="operation clearfix same_module mb15">
            <ul class="choice_search">
                <li class="clearfix col-xs-2 col-lg-2 col-ms-3 "><label class="label_name ">会员名称：</label><input name="" type="text" class="form-control col-xs-6 col-lg-5" id="HuiName"/></li>

                <button class="btn button_btn bg-deep-blue " onclick="" type="button"><i class="fa  fa-search" id="btnName"></i>&nbsp;搜索</button>
            </ul>
        </div>
        <div class="h_products_list clearfix" id="Sellerber">
            <div class="Sellerber_left menu" id="menuBar">
                <div class="show_btn" id="rightArrow"><span></span></div>
                <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
                <div class="menu_style" id="menu_style">
                    <div class="list_content">
                        <div class="side_list">
                            <div class="column_title"><h4 class="lighter smaller">会员列表</h4></div>
                            <div class="st_tree_style tree">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="bkg_List_style list_Exhibition list_show padding15">

                <div class="datalist_show">
                    <div class="bkg_List clearfix datatable_height confirm" id="testIframe">
                        <table class="layui-hide" id="sample_table" lay-filter="demo"></table>
                        <script type="text/html" id="barDemo">
                            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                        </script>
                    </div>
                    <div class="layui-tab-item">
                        <div id="pageDemo"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--用户信息-->
    <div class="userinfo_style" id="userinfo_style" style="display: none">
        <div class="member_show">
            <div class="member_jbxx clearfix">
                <img class="img" src="~/images/user.png" />
                <dl class="right_xxln">
                    <dt><span class="" id="userName"></span> <span class="">余额：40</span></dt>
                </dl>
            </div>
            <div class="member_content">
                <ul>
                    <li><label class="label_name">用户Id：</label><span class="test" id="test"></span></li>
                    <li><label class="label_name">真实姓名：</label><span class="realName" id="realName"></span></li>
                    <li><label class="label_name">性别：</label><span class="userSex" id="userSex"></span></li>
                    <li><label class="label_name">手机：</label><span class="phone" id="phone"></span></li>
                    <li><label class="label_name">地址：</label><span class="address" id="address"></span></li>

                    <li>
                        <label class="form-label">省份：</label>
                        <div class="formControls ">
                            <span class="select-box" style="width:150px;">
                                <select class="select" id="province" name="Province" size="1">
                                    @foreach (var item in GetAddress)
                                    {
                                        <option value=@item.Province>@item.ProvinceName</option>
                                    }
                                </select>
                            </span>
                        </div>
                        <label class="form-label">城市：</label>
                        <div class="formControls ">
                            <span class="select-box" style="width:150px;">
                                <select class="select" id="city" name="City" size="1">
                                    @foreach (var item in GetAddress)
                                    {
                                        <option value=@item.City>@item.CityName</option>
                                    }
                                </select>
                            </span>
                        </div>
                        <label class="form-label">地区：</label>
                        <div class="formControls ">
                            <span class="select-box" style="width:150px;">
                                <select class="select" id="district" name="District" size="1">
                                    @foreach (var item in GetAddress)
                                    {
                                        <option value=@item.District>@item.DistrictName</option>
                                    }
                                </select>
                            </span>
                        </div>
                    </li>
                    <li>
                        <input style="text-align:center" type="submit" id="UpdateSub" value="&nbsp;&nbsp;修改&nbsp;&nbsp;" />
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>
</html>

<script>
    //设置内页框架布局

    $(function () {
        $("#Sellerber").frame({
            float: 'left',
            color_btn: '.skin_select',
            Sellerber_menu: '.list_content',
            page_content: '.list_show',//内容
            datalist: ".datatable_height",//数据列表高度取值
            header: 65,//顶部高度
            mwidth: 200,//菜单栏宽度
        });
    });

    function userinfo(id) {
        layer.open({
            type: 1,
            title: '用户信息',
            maxmin: true,
            shadeClose: false, //点击遮罩关闭层
            area: ['800px', ''],
            content: $('#userinfo_style'),
        });
    }

    //点击查询按钮查用户名（模糊查询也可以）
    $("#btnName").click(function () {
        var table = layui.table;
        var huiName = $("#HuiName").val();
        alert(huiName);
        table.reload('sample_table', {
            where: {
                name: huiName
            }
        });
    });

    $("#UpdateSub").click(function () {
        var data = {};

        data.Id = $("#test").html();
        data.UserName = $("#userName").html();
        data.RealName = $("#realName").html();
        data.UserSex = $("#userSex").html();
        data.Phone = $("#phone").html();
        data.Address = $("#address").html();
        data.Province = $("#province option:selected").val();
        data.City = $("#city option:selected").val();
        data.District = $("#district option:selected").val();


        $.ajax({
            url: "/Member/UpdateUser" ,
            type: "Post",
            data: data,
            success: function (data) {
                if (data.Success) {
                    layer.msg('修改失败...', {
                        title: '提示框',
                        icon: 1,
                        time: 1000
                    });
                } else {
                    layer.msg('修改成功...', {
                        title: '提示框',
                        icon: 1,
                        time: 1000
                    });
                }
            }
        });
    });


    // 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，
    // 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
    // 例子：
    //Format("2016-10-04 8:9:4.423","yyyy-MM-dd hh:mm:ss.S") ==> 2016-10-04 08:09:04.423
    // Format("1507353913000","yyyy-M-d h:m:s.S")      ==> 2017-10-7 13:25:13.0
    function Format(datetime, fmt) {
        var newtime = datetime.replace(/\/Date\((\d+)\)\//gi, "$1");
        if (parseInt(newtime) == newtime) {
            if (newtime.length == 10) {
                newtime = parseInt(newtime) * 1000;
            } else if (newtime.length == 13) {
                newtime = parseInt(newtime);
            }
        }
        newtime = new Date(newtime);
        var o = {
            "M+": newtime.getMonth() + 1,                 //月份
            "d+": newtime.getDate(),                    //日
            "h+": newtime.getHours(),                   //小时
            "m+": newtime.getMinutes(),                 //分
            "s+": newtime.getSeconds(),                 //秒
            "q+": Math.floor((newtime.getMonth() + 3) / 3), //季度
            "S": newtime.getMilliseconds()             //毫秒
        };
        if (/(y+)/.test(fmt))
            fmt = fmt.replace(RegExp.$1, (newtime.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt))
                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }

    $(function () {
        layui.use('table', function () {
            //用table就要定义
            var table = layui.table;

            //表格加载
            table.render({
                elem: '#sample_table'
                , height: 500
                , url: '/Member/GetPageList' //数据接口
                , page: true //开启分页
                , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                , cols: [[ //表头
                    { type: 'checkbox' }    //开启复选框
                    , { field: 'Id', title: 'Id', sort: true, }
                    , { field: 'UserName', title: '用户名', sort: true }
                    , { field: 'RealName', title: '真实姓名', sort: true }
                    , { field: 'UserSex', title: '性别', sort: true }
                    , { field: 'Phone', title: '电话', sort: true }
                    , { field: 'Address', title: '地址', sort: true }
                    , { field: 'CreateTime', title: '加入时间', width: 120, sort: true, templet: '<div>{{ Format(d.CreateTime,"yyyy-MM-dd hh:mm:ss")}}</div>' }
                    // , { field: 'Enabled', title: '是否可用', width: 110, templet: '#checkboxTpl', unresize: true }
                    , { field: 'Status', title: '状态', sort: true, templet: '#checkboxTpl', unresize: true  }
                    , { title: '编辑', fixed: 'right', width: 200, align: 'center', toolbar: '#barDemo' }
                ]]
            });


            //监听工具条
            table.on('tool(demo)', function (obj) {
                var data = obj.data //获得当前行数据
                var id = data.Id;

                $("#test").text(data.Id);
                $("#userName").text(data.UserName);
                $("#realName").text(data.RealName);
                $("#userSex").text(data.UserSex);
                $("#phone").text(data.Phone);
                $("#address").text(data.Address);

                if (obj.event === 'del') {
                    //删除的功能代码
                    layer.confirm('真的要删除吗', function (index) {
                        $.ajax({
                            url: "/Member/DeleteUser?id=" + id,
                            type: "Post",
                            success: function (data) {
                                if (data.Success) {
                                    layer.msg('删除成功...', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 1000
                                    });
                                } else {
                                    layer.msg('删除失败...', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 1000
                                    });
                                }
                            }
                        });
                    });
                } else if (obj.event === 'edit') {
                    layer.open({
                        type: 1,
                        title: '编辑管理员',
                        area: ['700px', ''],
                        shadeClose: false,
                        content: $('#userinfo_style'),
                        end: function () {
                        }
                    });
                }
            });

            //监听锁定操作
            table.on('checkbox(lockDemo)', function (obj) {
                layer.msg('操作成功');
                if (obj.elem.checked == true) {
                    Status(1, this.value);
                } else {
                    Status(0, this.value);
                }
            });

        });
    });


    //修改状态
    function Status(Status, Uid) {
        $.ajax({
            type: "post",
            url: "/Member/UpdateStatus?Uid=" + Uid + "&Status=" + Status,
            success: function (data) {
                if (data.Success) {
                } else {
                }
            }
        });
    }


</script>
<script type="textml" id="checkboxTpl">
    <!-- 这里的 checked 的状态只是演示 -->
    <input type="checkbox" name="lock" value="{{d.Uid}}" title="禁用" lay-filter="lockDemo" {{ d.Status == 1 ? 'checked' : '' }}={{ d.Status == 1 ? 'checked' : '' }} />
</script>
